<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>weibo gift promotion</title>
  <link rel="stylesheet" href="http://cdn.staticfile.org/normalize/2.1.0/normalize.min.css" media="all">
  <script src="http://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
  <script src="http://cdn.staticfile.org/handlebars.js/1.0.rc.2/handlebars.min.js"></script>
  <!--[if lt IE 9]>
    <script src="http://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  <![endif]-->
</head>
<body>
</body>
<script id="test" type="text/x-handlebars-template">
<p style="font-size:14px; color:#fofofo; text-decoration:line-through;">We are {{title}}, and our website location is <a href="{{url}}">{{url}}</a></p>
<div id="haha">what is up!</div>
</script>
<script>
$(function(){
  var data, lang, ajax_url, lang_re;

  lang_reg = /en/;
  if (lang_reg.test(window.navigator.language || window.navigator.userLanguage)) {
    lang = "en";
  } else {
    lang = "cn";
  }

  ajax_url = "http://weibo-gift-promotion.192.168.7.145.xip.io/test-"+lang+".json"
  $.ajax({
    url: ajax_url,
    type: "get",
    dataType: "json",
    success: function(res){
      data = res;
      console.log('ok');
    }
  }).done(function(){
    var template = Handlebars.compile($("#test").html());

    $("body").html(template(data));

    $("#haha").click(function(){
      console.log(data.url);
    });
  });
});
</script>
</html>
